<template>
    <!--管理端导航栏-->
      <el-menu
          :default-active="activeIndex"
          class="el-menu-demo"
          mode="horizontal"
          :ellipsis="false"
      >
        <el-menu-item index="0">
          <img
              style="width: 85px"
              src="../../assets/logo2.png"
              alt="Element logo"
          />
        </el-menu-item>
        <div class="flex-grow" />
        <el-menu-item index="1" style="font-weight: bold">管理员端</el-menu-item>
        <el-sub-menu index="2">
          <template #title>个人中心</template>
          <el-menu-item index="2-1">个人资料</el-menu-item>
          <el-menu-item index="2-2">平台数据分析</el-menu-item>
          <el-sub-menu index="2-3">
            <template #title>平台信息管理</template>
            <el-menu-item index="2-3-1">学生信息管理</el-menu-item>
            <el-menu-item index="2-3-2">教师信息管理</el-menu-item>
          </el-sub-menu>
          <el-menu-item index="2-4">退出登录</el-menu-item>
        </el-sub-menu>
      </el-menu>
    <!--管理端侧边栏-->
      <el-row class="tac">
        <el-col :span="4">
          <h5 class="mb-2">管理员信息管理中心</h5>
          <el-menu
              default-active="2"
              class="el-menu-vertical-demo"
              router
          >
            <el-menu-item index="index">
              <el-icon><icon-menu /></el-icon>
              <span>首页</span>
            </el-menu-item>
            <el-sub-menu index="userinfo">
              <template #title>
                <el-icon><UserFilled /></el-icon>
                <span>用户信息管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="student">学生信息管理</el-menu-item>
                <el-menu-item index="teacher">教师信息管理</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
            <el-menu-item index="cp" >
              <el-icon><TrendCharts /></el-icon>
              <span>竞赛信息管理</span>
            </el-menu-item>
            <el-menu-item index="ac">
              <el-icon><Opportunity /></el-icon>
              <span>活动信息管理</span>
            </el-menu-item>
          </el-menu>
        </el-col>
      </el-row>
  <el-main class="content">
    <router-view/>
  </el-main>

</template>
<script setup>
import {
  TrendCharts,
  Menu as IconMenu,
  UserFilled,
  Opportunity
} from '@element-plus/icons-vue'


</script>
<style scoped>

.flex-grow {
  flex-grow: 1;
}
.content {
  height: 100%;
  width: 1170px;
  background-color: #FAFAFA;
  position: absolute;
  left: 250px;
  top: 140px;
}

</style>